<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>作业6</title>
</head>

<body>
    <!--3 将模型数据和视图进行绑定-->
    <div id="app">
        <!--扩展需求：在下方表格中展示品牌信息-->
        <table id="brandTable" border="1" cellspacing="0" width="100%">
            <tr>
                <th>编号</th>
                <th>姓名</th>
                <th>性别</th>
                <th>职位</th>
                <th>入职日期</th>
                <th>最后操作时间</th>

            </tr>
            <tr align="center" v-for="(item,index) in brands">
                <td>{{item.id}}</td>
                <td>{{item.name}}</td>
                <td>{{item.gender==1?"男":"女"}}</td>
                <td>{{item.job}}</td>
                <td>{{item.entrydate}}</td>
                <td>{{item.updatetime}}</td>
            </tr>


        </table>
    </div>

    <!--1 引入js文件-->
    <script src="../../js/axios-0.18.0.js"></script>

    <script src="../../js/vue.js"></script>
    <!--2 定义Vue对象，初始化模型数据-->
    <script>
        new Vue({
            el: "#app",
            data: {
                brands: []
            },
            mounted() { // 钩子函数
                axios.get("http://yapi.eehp.cn/mock/61/user/findAll").then((result) => {
                    // alert(result.data.data);
                 this.brands = result.data.data;
                });
            }
        });
    </script>
</body>

</html>